<template>
	
	<div>
	  <el-row class="top">
	    <el-col :span="24"><div class="grid-content bg-purple-dark"></div></el-col>
	  </el-row>
	  <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
	  <el-row class="partly" :gutter="20">
	    <el-col :span="6"><el-menu-item index="1">高考资讯</el-menu-item></el-col>
	    <el-col :span="6"><el-menu-item index="2">院校查询</el-menu-item></el-col>
	    <el-col :span="6"><el-menu-item index="3">院校查询</el-menu-item></el-col>
	    <el-col :span="6"><el-menu-item index="4">院校查询</el-menu-item></el-col>
	  </el-row>
	  </el-menu>
	  <hr />
	  <div class="box">
		  <el-container>
		    <el-header>高考资讯</el-header>
		    <el-main><el-table
	  :data="tableData"
	  style="width: 100%">
	  <el-table-column
	    prop="news"
	    
	    width="500">
	  </el-table-column>
	  <el-table-column
	    prop="time"
	    
	    width="180">
	  </el-table-column>
	  
	</el-table></el-main>
		  </el-container>
	  </div>
	 </div>
</template>

<script>
	import "../mock/mock.js"
	export default {
	      data() {
	        return {
	          tableData: []
	        }
	      },
		  mounted() {
		  	this.getList();
		  },
		  methods:{
			  getList(){
				  this.$httpApi.get('http://localhost:8088/newss')
				  	.then(res => {
				  		this.tableData = res.data;
						// console.log(res.data);
				  	})
			  }
		  }
	    }
</script>

<style>
	
	 
	 .top{
		 margin-bottom: 20px;
		 background: back;
	 }
	 .partly {
	     margin-bottom: 20px;
	     &:last-child {
	       margin-bottom: 0;
	     }
	   }
	   .el-col {
	     border-radius: 4px;
	   }
	   .bg-purple-dark {
	     background: aliceblue;
	   }
	   .bg-purple {
	     background: #ffffff;
	   }
	   .bg-purple-light {
	     background: #e5e9f2;
	   }
	   .grid-content {
	     border-radius: 5px;
	     min-height: 36px;
	   }
	   .row-bg {
	     padding: 10px 0;
	     background-color: #f9fafc;
	   }
	.box{
	height: 500px;
	background: #ffffff;
	
	}
	 .el-header {
	    background-color:aliceblue;
	    color: #333;
	    text-align: center;
	    line-height: 60px;
		
	  }
	  .el-main {
	      background-color: #ffffff;
	      color: #333;
	      text-align: center;
	      
	    }
</style>
